最近又收到小伙伴做的UI界面啦，我们一起来看看有没有什么问题，希望可以帮助大家解决一些细节问题。

从提交的这张UI界面来分析，先看一下整体，我们利用模块覆盖法来将页面的内容区分一下：

我们发现顶部的内容在整体视觉上比较拥挤，并且信息比较散，所以我们要对顶部这块内容再拆分重组一下。这里他将数字部分内容整合到了左侧，但是这样会让左侧内容过于拥挤，而且右侧区域只有一个图标是达不到平衡的效果，虽然放了标签，但是标签和人的关联性还是差了一些，所以标签要么跟头像要么跟名字，而不要躲在角落里。

另外数字的字体使用也会有一种被挤扁的感受，这里不建议用这样很瘦的字体。并且这里其实他将点赞和收藏一起收了起来可能是因为左侧放不下了，那么我们直接就另一起一行放数字新信息即可。这样名字与头像和平衡对称，数字又可以水平平均铺开，这是一种常规的处理方法。

其次，整个版面白色区域较多，那么中间的开通会员卡片的色彩就过于重了，虽然我们需要引导用户去开通，但是视觉上给人感知太强烈，就感觉有点突兀。

个人中心其实更多的是展示与我相关的信息和内容，目前大部分产品的设计风格也都是以简洁为主，所以我们也尽可能的利用到这点。卡片插在中间是个不错的想法，但是一般我们在做UI设计的时候层级做出3层及3层以内即可，不要出现第四层。

3层指的是：背景层、内容层、悬浮层/叠加层，如果一个界面中出现4层，会导致界面的层级过多，信息就较为复杂，所以这个界面中，收藏夹一栏的卡片是不需要加投影的，只需要图标加文字的上下排列即可。

接下去，下方的功能列表在浏览上效率过低，我们看到要浏览完这列信息我们视线需要折行，并且这些功能是不需要都放在页面下方去堆叠，其实顶部导航栏也是可以利用起来的，由于这是一款美食类的产品，用户很多时候也会在个人中心去搜索我创建的食谱、作品等内容，所以像搜索和消息可以直接放在导航栏，而设置和关于这些较低频的操作就可以合并起来，那么原来6行列表就变为了4行，那这四行内容我们可以直接用横向排列的形式去做了。

那么最后，如果要对界面做视觉上的优化，我们要对信息重新排版、图标进行重新设计，在原图中我觉得底部中间的图标还是具有品牌特征的，那么我们就把这个品牌特征拿过来，作为一个辅助图形，这个辅助图形就可以用在小标签和卡片背景的修饰中。

最后的效果图和第一版本进行一个对比，因为偷懒底部图标就不画了，你们学废了吗？赶紧交作业啊啊啊啊啊
/ End /


本文原创，未经作者允许不可转载！
更多内容，欢迎关注作者微信公众号：应谋鬼计！